<template>
  <!-- <div> -->
    <s-table
      class="h100"
      ref="flowConfigTable"
      :columns="columns"
      :data="loadData"
      :showPagination="true"
      rowKey="key"
    >
      <template #businessName="text, record">
        <table-ellipsis :text="record.businessName"></table-ellipsis>
      </template>
      <template #businessCode="text, record">
        <table-ellipsis :text="record.businessCode"></table-ellipsis>
      </template>
    </s-table>
  <!-- </div> -->
</template>
<script>
import { mapState } from 'vuex'
import STable from '@/components/Table/index'
import tableEllipsis from '@/components/Ellipsis/TableEllipsis'
import { allApplyColumns } from '../config/list'

export default {
  components: {
    STable,
    tableEllipsis
  },
  props: {
    tableData: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  computed: {
    // 查询条件参数
    ...mapState({
      queryParams: (state) => state.businessType.queryParams
    })
  },
  data () {
    return {
      columns: allApplyColumns
    }
  },
  methods: {
    // 请求接口数据加载表格
    loadData (parameter) {
      const vm = this
      const JnqueryParam = JSON.parse(JSON.stringify(vm.queryParams))
      // eslint-disable-next-line no-restricted-syntax
      for (const key in JnqueryParam) {
        if (JnqueryParam[key] === '') {
          JnqueryParam[key] = undefined
        }
      }
      return this.$api.getAllBusinessType({ ...parameter, ...JnqueryParam })
    },
    // 刷新表格
    refreshData (isToFirstPage = true) {
      let obj = null
      if (isToFirstPage) {
        obj = { current: 1 }
      }
      this.$refs.flowConfigTable.loadData(obj)
    }
  }
}
</script>
<style lang="less" scoped>
.set-margin {
  margin-right: 12px;
}
</style>
